<#assign title="找回密码" />
<#include 'common/header.html' />
<link rel="stylesheet" href="${ctx}/themes/default/css/member.css" type="text/css" />

<style>
.from-line{
	border: 1px solid #d9d9d9;
    border-radius: 5px;
    box-sizing: border-box;
    font-size: 14px;
    height: 50px;
    transition: all 0.3s ease-out 0s;
    width: 300px;
    margin-top: 20px;
}

.from-line input{
	border: 0 none;
    height: 48px;
    width: 220px;
    font-size: 14px;
}

.from-line button{
	background-color: #03a9f4;
    border: 0 none;
    border-radius: 5px;
    color: #fff;
    font-size: 16px;
    height: 50px;
    line-height: 50px;
    width: 300px;
}
</style>

<div id="findpwd_wrapper" style="height: 350px;text-align: center;" >
	<h1>找回密码<span></span></h1>
	<form  method="post"  class="validate" id="findPsswordForm">
		<div style="width: 420px;margin-left: 200px;">
			<div class="from-line" style="width: 400px;">
				<input type="text" name="mobile" id="mobile" placeholder="手机号" >
				<button style="float: right;width: 150px;height:40px;line-height: 40px; " class="tran get-message pr" type="button" onclick="sendCode()" id="btnSendCode">
					<a class="tran" href="javascript:;" style="color: white;" >获取短信验证码</a>
				</button>
			</div>
			
			<div class="from-line">
				<label>验证码：</label>
				<input type="text" name="validcode" />
			</div>
		</div>
		<div class="from-line" style="margin-left: 200px;" >
			<button class="tran get-message pr m_register" type="button" onclick="" >
				<a class="tran" href="javascript:;" style="color: white;" >找回密码</a>
			</button>
		</div>
	</form>
</div>
<script type="text/javascript">

var InterValObj; //timer变量，控制时间
var count = 10; //间隔函数，1秒执行
var curCount;//当前剩余秒数




//timer处理函数
function SetRemainTime() {
    if (curCount == 0) {                
        window.clearInterval(InterValObj);//停止计时器
        $("#btnsend").removeAttr("disabled");//启用按钮
        $(".form_param .from-line button").css("background-color","#03a9f4");
        $("#btnsend a").html("重新发送验证码");
    }
    else {
        curCount--;
        $("#btnsend a").html("已发送,请在" + curCount + "秒内输入验证码");
    }
}

//发送验证码
function sendCode(){
	$.ajax({
		url:"api/shop/member!sendCode.do",
		type:"POST",
		data:"mobile=" + $("#mobile").val(),
		dataType:"json",
		success:function(data){
			if(data.result==0){
				//$("#btnSendCode").removeAttr("disabled");//启用按钮
				alert(data.message);
				$("#btnsend a").html("重新发送验证码");
			}else{
				 curCount = count;
			     $("#btnsend").attr("disabled", "true");
			     $("#btnsend a").html("已发送,请在" + curCount + "秒内输入验证码");
			     InterValObj = window.setInterval(SetRemainTime, 1000);  //启动计时器，1秒执行一次
			     $(".form_param .from-line button").css("background-color","#9D9D9D");
			}
		},
		error:function(){
			alert("出现错误");
		}
	});	
}

</script>
<#include 'common/footer.html' />